<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>

    </style>
</head>

<body>
    <script src="../框架相关的js/vue.js"></script>
    <script src="../框架相关的js/axios.min.js"></script>
    <div id="app">
        {{fullName}}

        {{com1}}

        <div v-if="data">        {{data.status}}</div>
        <button @click="changedata">改变data</button>
    </div>




    <script>
        // import axios  from 'axios'
        var vm = new Vue({
            el: '#app',
            data: {
                firstName: 'Foo',
                lastName: 'Bar',
                data:null
            },
            computed: {
                fullName: {
                    // getter
                    get: function () {
                        return this.firstName + ' ' + this.lastName
                    },
                    // setter
                    set: function (newValue) {
                        var names = newValue.split(' ')
                        this.firstName = names[0]
                        this.lastName = names[names.length - 1]
                    }
                },
                com1() {

                    axios({
                    method: 'get',//提交方法
                    url: 'https://petstore.swagger.io/v2/store/inventory',//提交地址
                    params: {
                    }
                }).then((res) => {
                    console.log(res);
                     this.data=res.data
                })
                    this.fn()
                }
            },
            mounted() {
                console.log(vm, '为什么是undefined');
            },
            created() {
                console.log(vm, '为什么是undefined');
            },
            methods: {
                fn() {
                    console.log('方法fn');
                },
                changedata(){
                    this.data.status=90 
                }
            },

        })
        vm.fullName = '马 英鹏'
        // console.log(vm);

    </script>
</body>

</html>